window.addEventListener('DOMContentLoaded', () => {
    function htmlRender() {
        var row = document.querySelector('.row')
        row.innerHTML = '';
        var row_text = ''
        data.forEach((item, index) => {
            var str = `        
            ${(index+1) % 3 == 0 ? `<div class="row__cell row__cell--fill">` : `<div class="row__cell row__cell--box" style="--num:${item.num}%">`}
            <p class="content">${item.url ? `<a href=${item.url}>${item.content}</a>` : item.content}</p>
            <p class = "description">${item.description ? item.description : '&nbsp;'}</p>
            </div>
    `;
            row_text += str
        })
        row.innerHTML = row_text
    }
    function init() {
        htmlRender()
    }
    init()
})
